<template>
	<view class="page-change-password">
		<u-navbar title="修改" back-icon-color="#000" :border-bottom="false"
		title-size="36" title-color="#000" title-bold></u-navbar>
		<u-form class="form" :model="form" ref="uForm">
			<u-form-item label="原始密码" :label-width="130" prop="oldpassword">
				<u-input v-model="form.oldpassword" placeholder="请输入原始密码" />
			</u-form-item>
			<u-form-item label="修改密码" :label-width="130" prop="password">
				<u-input v-model="form.password" placeholder="请输入修改密码" />
			</u-form-item>
			<u-form-item label="确认密码" :label-width="130" prop="password1">
				<u-input v-model="form.password1" placeholder="请输入确认密码" />
			</u-form-item>
		</u-form>
		<u-button type="error" shape="circle" class="custom-style" @click="submit">保存</u-button>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import { commonGet } from "@/api/commonapi.js"
	import md5Libs from "uview-ui/libs/function/md5";
	export default {
		data() {
			// 密码验证
			const pwdCheck = async(rule, value, callback) => {
			  let reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/
			  if (value.length < 6) {
				this.changeFlag = 2;
				return callback(new Error('密码不能少于6位'));
			  } else if (value.length > 16) {
				this.changeFlag = 2;
				return callback(new Error('密码最长不能超过16位'));
			  } else if (!reg.test(value)) {
				this.changeFlag = 2;
				return callback(new Error('必须是数字和字母'));
			  }else {
				this.changeFlag = 1;
				callback()
			  }
			  
			}
			// 重复密码验证
			const pwdAgainCheck = async(rule, value, callback) => {
			  if (value.length < 1) {
				this.changeAgainFlag = 2;
				return callback(new Error('确认密码不能为空'));
			  } else if(this.form.password != this.form.password1){
				this.changeAgainFlag = 2;
				return callback(new Error('两次输入密码不一致'));
			  }else{
				this.changeAgainFlag = 1;
				callback()
			  }
			};
			return {
				$baseUrl:"",
				changeFlag: 0,
				changeAgainFlag: 0,
				_creatememid:"",
				userInfo:null,
				form: {
					oldpassword: '',
					password: '',
					password1: ''
				},
				rules: {
					oldpassword: [
					  { required: true, validator: pwdCheck, trigger: 'blur'}
					],
					password: [
					  { required: true, validator: pwdCheck, trigger: 'blur'}
					],
					password1: [
					  { required: true, validator: pwdAgainCheck, trigger: 'blur' }
				    ]
				}
			}
		},
		onLoad() {
			this.$baseUrl = this.baseUrl
			if(this.$store.state.userIn){
				this.nickname = JSON.parse(this.$store.state.userIn).nickname
				this._creatememid = JSON.parse(this.$store.state.userIn).id
				this.userInfo = JSON.parse(this.$store.state.userIn)
			}
		},
		methods: {
			goNextPage(type,url,params){
				this.$u.route({
					type:type,
					url: url,
					params:params
				})
			},
			submit(){
				let _this = this
				_this.$refs.uForm.validate( async (valid) => {
					if (valid) {
						let query = {
							ak:_this.$store.state.token,
							cmd:"mMember_update_proc_pwd",
							para:JSON.stringify({
								id:"1",
								oldpassword:md5Libs.md5(_this.form.oldpassword),
								password:md5Libs.md5(_this.form.password),
								sysMemID:_this._creatememid
							})
						}
						commonGet(query,({Message})=>{
							console.log('----->',Message)
							if(Message == "操作成功！"){
								this.$refs.uToast.show({
									title: '修改成功',
									type: 'success',
									back:true
								})
							}else if(Message == "操作失败，请稍候再试！"){
								this.$refs.uToast.show({
									title: '原密码错误',
									type: 'error'
								})
							}
						})
					}
				})
			}
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
	}
</script>

<style lang="scss" scoped>
.page-change-password{
	background-color: #f5f5f5;
	overflow: hidden;
	height: 100vh;
	background-color: #fff;
	.header{
		background-color: #fff;
		.header-left{
			image{
				width: 124rpx;
				height: 124rpx;
				border-radius: 100%;
			}
			.nickname{
				font-weight: bold;
			}
		}
	}
	.form{
		padding: 0 30rpx;
	}
	.custom-style {
		background-color: #c40200;
		margin: 73rpx 30rpx;
		font-size: 30rpx;
	}
}
</style>
